<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>我的生活</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1">
    <link rel="shortcut icon" href="/favicon.ico">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" type="text/css" href="../css/person.css">
    <link rel="stylesheet" href="http://g.alicdn.com/msui/sm/0.6.2/css/sm.min.css">
    <link rel="stylesheet" href="http://g.alicdn.com/msui/sm/0.6.2/css/sm-extend.min.css">
    <script src="https://cdn1.lncld.net/static/js/av-min-1.2.1.js"></script>

    <script type="text/javascript">
	window.onload=function () {
	
		}
	</script>
  </head>
  <body id="b">
    <div class="page-group">
        <div class="page page-current">
            <header id="head">
	            <label id="registerword">登 录</label>
	        </header>
	        <form>
	        	<div>
	        	<label id="basicmessage">基本信息</label>
	        		<div style="background-color: #ffffff;">
	        			<div id="Myportrait">
				            <img src="../images/person.png" class="headIcon" id="icon" width="45" height="45">
				            <span id="addportrait" >点击添加头像</span>
				           	<img src="../images/arrows.jpg" class="arrows" style="margin-top: 27px;">
			            </div>
			            <div class="person_file">
			            	<label style="margin-left:10px;">用户名</label>
			            	<input type="text" name="username" placeholder="请输入2-16个字符" id="person_username">
			            </div>
			            <div class="person_file">
			            	<label style="margin-left:10px;">性别</label>
			            	<div class="gender">
               	                <label id="men">先生</label>
                             	<label id="woman">女士</label>
                            </div>
			            </div>
			            <div class="person_file">
			            	<label style="margin-left:10px;">备用电话</label>
			            	<input type="text" name="phonename" id="person_phonenumber" style="padding-left:20px">
			            	<img src="../images/arrows.jpg" class="arrows" style="margin-top:12px;">
			            </div>
			            <div class="person_file">
			            	<label style="margin-left:10px;">版本</label>
			            	<label id="person_version">1.0.0</label>
			            </div>
	        		</div>
	        	</div>
	        </form>
	        <div>
	        	<button id="person_button">保 存</button>
	        </div>
        </div>
    </div>

    <script type='text/javascript' src='http://g.alicdn.com/sj/lib/zepto/zepto.min.js' charset='utf-8'></script>
    <script type='text/javascript' src='http://g.alicdn.com/msui/sm/0.6.2/js/sm.min.js' charset='utf-8'></script>
    <script type='text/javascript' src='http://g.alicdn.com/msui/sm/0.6.2/js/sm-extend.min.js' charset='utf-8'></script>
    	<script type="text/javascript" src="../js/utils.js"></script>

	<script type="text/javascript">
		var APP_ID = 'Gm6RGzfleHPVMWOxgL8XYG19-gzGzoHsz';
		var APP_KEY = 'e4yNVE3KJUEEAqFMsdTC8NM8';
		AV.init({
			appId: APP_ID,
			appKey: APP_KEY
		});

		  var query = new AV.Query('new').first();
		  query.then(function(data) {
		  	// 成功获得实例
		  	// data 就是 id 为 57328ca079bc44005c2472d0 的 Todo 对象实例
		  	// alert(data.results[0].url)
		  	var results = data

		  	var icon = document.getElementById('icon')
			icon.src = results.get("url")

			var phonenumber = localStorage.getItem("phonenumber")
			AjaxIO.post("/updateHeadIcon",{iconUrl:results.get("url"),phonenumber:phonenumber},function(result){
				
			})

		  }, function(error) {
		  	// 失败了
		  	alert("失败")
		  	alert(error)
		  });
		function change(url){
				var icon = document.getElementById('icon')
				icon.src = url
		}
		var menOrWomen;
		var men=document.getElementById("men");
		var women=document.getElementById("women");

			men.onclick=function () {
				men.style.color="black";
				men.style.borderBottom="2px solid rgba(87,191,254,1)";
				woman.style.color="rgba(217,217,217,1)"
				woman.style.borderBottom="none"
				menOrWomen = true 
			}
			woman.onclick=function () {
				woman.style.color="black";
				woman.style.borderBottom="2px solid rgba(87,191,254,1)";
				men.style.color="rgba(217,217,217,1)"
				men.style.borderBottom="none"
				menOrWomen = false 

			}
		$(document).ready(function(){
		$('#Myportrait').click(function(){
			try{
				responesToPhone("camera")
			} catch(error){
				
			}
		})
		$('#person_button').click(function(){
			var username = $('#person_username').val()
			var phonenumber_al = $('#person_phonenumber').val()
			var sex ;
			var phonenumber = localStorage.getItem("phonenumber")
			if (menOrWomen == true) {
				sex = "男"
			} else {
				sex = "女"
			}
			alert(sex)
			AjaxIO.post('/personal',{username:username,phonenumber_al:phonenumber_al,sex:sex,phonenumber:phonenumber},function(result){
				try{
					responesToPhone("dismiss")

				}catch(error){

				}
			})

		})
	})

	function responesToPhone(isSuccess){

		window.webkit.messageHandlers.responesToPhone.postMessage(isSuccess);
	}
			
	</script>
  </body>
</html>













